<template>
  <div>
    <div class="top">
      <div class="fl top-left">新建考核试卷</div>
      <!-- <el-input size="mini" class="fr top-right" suffix-icon="el-icon-search" placeholder="请输入搜索的姓名或证件号码" /> -->
    </div>
    <div class="body">
      <!-- <div class="buzhou">
        <el-steps :active="active" align-center style="width:500px">
            <el-step title="考核安排" description=""></el-step>
            <el-step title="考核人员安排" description=""></el-step>
        </el-steps>
      </div> -->
      <div v-if="active==1" class="form">
          <div class="title">基础设置</div>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">考场名称：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" v-model="form.name" />
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">级别：</span>
            </el-col>
            <el-col class="fl" :span="9">
              <el-cascader
                filterable
                style="width:100%;margin-right:20px"
                size="mini"
                v-model="tiaojians"
                :options="type_all"
                :props="{ checkStrictly: true, expandTrigger: 'hover' }"
                @change="getShijuan()"
                clearable>
              </el-cascader>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">考试要求：</span>
            </el-col>
            <el-col class="fl" :span="9">
              <el-select size="mini" filterable v-model="form.video" style="width:100%;">
              <el-option
                  v-for="item in type_yaoqiu"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
              />
              </el-select>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">试卷选择：</span>
            </el-col>
            <el-col class="fl" :span="9">
              <el-select size="mini" clearable filterable v-model="form.paperId" style="width:100%;">
              <el-option
                  v-for="item in type_shijuan"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
              />
              </el-select>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">优秀分数线：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" type="number" min="0" v-model="form.excellentScore">
                  <template slot="append">分</template>
                </el-input>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">良好分数线：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" type="number" min="0" v-model="form.greatScore">
                  <template slot="append">分</template>
                </el-input>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">及格分数线：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" type="number" min="0" v-model="form.qualifyScore">
                  <template slot="append">分</template>
                </el-input>
            </el-col>
          </el-row>
          <div class="title">上机考核设置</div>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">开始时间：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-date-picker
                    clearable
                    size="mini"
                    style="width:100%;"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    v-model="form.computerStartDatetime"
                    type="datetime"
                    placeholder="选择日期时间">
                </el-date-picker>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">结束时间：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-date-picker
                    clearable
                    size="mini"
                    style="width:100%;"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    v-model="form.computerEndDatetime"
                    type="datetime"
                    placeholder="选择日期时间">
                </el-date-picker>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">考核地点：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" v-model="form.computerPlace" />
            </el-col>
          </el-row>
          <div class="title">实操题考核设置</div>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">开始时间：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-date-picker
                    clearable
                    size="mini"
                    style="width:100%;"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    v-model="form.startDatetime"
                    type="datetime"
                    placeholder="选择日期时间">
                </el-date-picker>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">结束时间：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-date-picker
                    clearable
                    size="mini"
                    style="width:100%;"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    v-model="form.endDatetime"
                    type="datetime"
                    placeholder="选择日期时间">
                </el-date-picker>
            </el-col>
          </el-row>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <span class="fr mt">考核地点：</span>
            </el-col>
            <el-col class="fl" :span="9">
                <el-input clearable size="mini" v-model="form.place" />
            </el-col>
          </el-row>
          <div class="title">考官设置</div>
          <el-row :span="24">
            <el-col class="mb" :span="8">
                <div class="fr mt">
                    <!-- <div class="bianhao fl">{{index + 1}}</div> -->
                    <div class="fl">考官名称：</div>
                </div>
            </el-col>
            <el-col class="fl" :span="9">
                <el-select clearable filterable size="mini" multiple v-model="examExaminers" style="width:100%;">
                <el-option
                    v-for="item in type_guanli"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
                </el-select>
            </el-col>
          </el-row>
          <!-- <el-row :span="24">
            <el-col class="mb" :span="8">
                <div class="fr mt">
                    <div class="fl"> </div>
                </div>
            </el-col>
            <el-col class="fl" :span="9">
                <div class="add-guanli shou"  @click="guanlis.push({name:'', value: ''})">添加管理员项+</div>
            </el-col>
          </el-row> -->
          
      </div>
      <div v-if="active==2" class="head">
        <el-button v-if="active==2" type="" size="small" @click="active=1">上一步</el-button>
        <el-button type="primary" size="mini" @click="add()">添加考生</el-button>
        <el-button type="" size="small" class="fr" style="min-width:68px" @click="exit()">关闭</el-button>
      </div>
      <el-table
        v-if="active==2"
        :header-cell-style="{
          'background-color': '#FAFAFA',
          'height': '54px',
          'color': '#000000',
          'font-size': '14px',
          'font-weight': 'bold'
      }"
        :data="tableData_kaosheng"
        @selection-change="tableSelect"
        size="mini"
        empty-text="暂无数据"
        stripe
        style="width: 100%">
        <!-- <el-table-column
        type="selection"
          align="center"
        width="60">
        </el-table-column> -->
        <el-table-column
          label="照片"
          align="center"
          width="120">
            <template slot-scope="scope">
              <el-image :src="scope.row.examineeListVo.portrait"></el-image>
          </template>
        </el-table-column>
        <el-table-column
          label="姓名"
          align="center"
          width="100">
            <template slot-scope="scope">
              {{scope.row.examineeListVo.name}}
          </template>
        </el-table-column>
        <el-table-column
          label="性别"
          align="center"
          width="80">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.examineeListVo.sex=='男'">{{scope.row.examineeListVo.sex}}</el-tag>
              <el-tag v-else type="success">{{scope.row.examineeListVo.sex}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="账号"
          width="160">
            <template slot-scope="scope">
              <span class="shenglue" :title="scope.row.examineeListVo.account">{{scope.row.examineeListVo.account}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="身份证号">
            <template slot-scope="scope">
              <span class="shenglue" :title="scope.row.examineeListVo.idcard">{{scope.row.examineeListVo.idcard}}</span>
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          align="center"
          label="操作"
          width="120">
            <template slot-scope="scope">
              <!-- <el-button type="text" @click="shanchu(scope.row, scope.$index)">删除</el-button> -->
              <el-button v-if="panduan(scope.row.examineeListVo)" type="text" @click="xuanze(scope.row.examineeListVo, true, -1)">选择</el-button>
              <el-button v-else type="text" style="color:red" @click="xuanze(scope.row.examineeListVo, false, scope.$index)">取消选择</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- <div v-if="active==2" style="width:100%;height:30px;margin-top: 24px;">
        <el-pagination
          style="float:right"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          background
          :hide-on-single-page="false"
          :current-page="tiaojian_kaosheng.page"
          :page-sizes="[10, 20, 50, 100, 500]"
          :page-size="tiaojian_kaosheng.size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div> -->
      <div class="bottom">
        <el-button v-if="active==2" type="" size="small" @click="active=1">上一步</el-button>
        <el-button v-if="active==1" type="" size="small" @click="next()">下一步</el-button>
        <el-button v-if="active==1" type="primary" size="small" style="min-width:68px" @click="submit()">提交修改</el-button>
        <el-button type="" size="small" style="min-width:68px" @click="exit()">关闭</el-button>
      </div>
    </div>
    <el-dialog title="添加考生" width="66%" :visible.sync="dialogFormVisible">
      <div class="head">
        <div class="fl mt">状态：</div>
        <el-select size="mini" clearable filterable v-model="tiaojian_kaosheng.status" @change="getData()" style="float:left;width:150px;margin-right:20px">
          <el-option
              v-for="item in type_zhuangtai"
              :key="item.value"
              :label="item.name"
              :value="item.value"
          />
        </el-select>
        <div class="fl mt">级别：</div>
        <el-cascader
          filterable
          style="float:left;width:400px;margin-right:20px"
          size="mini"
          v-model="tiaojians_kaosheng"
          :options="type_all"
          :props="{ checkStrictly: true, expandTrigger: 'hover' }"
          @change="getData()"
          clearable>
        </el-cascader>
        <div class="fl mt">姓名：</div>
        <el-input
          style="float:left;width:150px;margin-right:20px"
          size="mini"
          v-model="tiaojian_kaosheng.name"
          @input="getData()"
          clearable>
        </el-input>
      </div>
      <el-table
        height="400px"
        :header-cell-style="{
          'background-color': '#FAFAFA',
          'height': '54px',
          'color': '#000000',
          'font-size': '14px',
          'font-weight': 'bold'
      }"
        :data="tableData"
        @selection-change="tableSelect"
        size="mini"
        empty-text="暂无数据"
        stripe
        style="width: 100%">
        <!-- <el-table-column
        type="selection"
          align="center"
        width="60">
        </el-table-column> -->
        <el-table-column
          label="照片"
          align="center"
          width="120">
            <template slot-scope="scope">
              <el-image :src="scope.row.portrait"></el-image>
          </template>
        </el-table-column>
        <el-table-column
          label="姓名"
          align="center"
          width="100">
            <template slot-scope="scope">
              {{scope.row.name}}
          </template>
        </el-table-column>
        <el-table-column
          label="性别"
          align="center"
          width="80">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.sex=='男'">{{scope.row.sex}}</el-tag>
              <el-tag v-else type="success">{{scope.row.sex}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="账号"
          width="160">
            <template slot-scope="scope">
              <span class="shenglue" :title="scope.row.account">{{scope.row.account}}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="身份证号">
            <template slot-scope="scope">
              <span class="shenglue" :title="scope.row.idcard">{{scope.row.idcard}}</span>
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          align="center"
          label="操作"
          width="120">
            <template slot-scope="scope">
              <el-button v-if="panduan(scope.row)" type="text" @click="xuanze(scope.row, true, -1)">选择</el-button>
              <el-button v-else type="text" style="color:red" disabled @click="xuanze(scope.row, false, -1)">已选择</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div style="width:100%;height:30px;margin-top: 24px;">
        <el-pagination
          style="float:right"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          background
          :hide-on-single-page="false"
          :current-page="tiaojian_kaosheng.page"
          :page-sizes="[10, 20, 50, 100, 500]"
          :page-size="tiaojian_kaosheng.size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import $http from '@/utils/request'
import $httpFORM from '@/utils/requestFORM'
import $httpJSON from '@/utils/requestJSON'

export default {
  name: 'Dashboard',
  computed: {
    ...mapGetters([
      'name'
    ])
  },
  data () {
    return {
      dialogFormVisible: false,
      active: 1,
      span1: 5,
      span2: 7,
      selects: [],
      guanlis: [],
      type_all: [],
      type_zhuangtai: [{
        name: '全部',
        value: ''
      }, {
        name: '启用',
        value: false
      }, {
        name: '封禁',
        value: true
      }],
      tiaojians: [],
      tiaojians_kaosheng: [],
      type_guanli: [],
      type_shijuan: [],
      type_yaoqiu: [{
        name: '考前拍照且考后拍照',
        id: 1,
      }, {
        name: '无需拍照',
        id: 2,
      }],
      tableData: [],
      tableData_kaosheng: [],
      total: 0,
      tiaojian: {
        page: 1,
        size: 99999,
        rankId: '', // 级别id
        departmentId: '', //部门id
        positionId: '', // 岗位id
        professionId: '', // 专业id
        status: false // 试卷状态，默认查所有，false查未删除的，true查已经逻辑删除的
      },
      tiaojian_kaosheng: {
        page: 1,
        size: 10,
        rankId: '', // 级别id
        departmentId: '', //部门id
        positionId: '', // 岗位id
        professionId: '', // 专业id
        status: false // 试卷状态，默认查所有，false查未删除的，true查已经逻辑删除的
      },
      examExaminees: [],
      examExaminers: [],
      form: {
        computerEndDatetime: '', // 上机结束时间
        computerPlace: '', // 上机地点
        computerStartDatetime: '', // 上机考试时间
        departmentId: '', // 部门
        endDatetime: '', // 结束时间
        examExaminees: [ // 考场-考生，只用填考生id
          {
            examId: '',
            examineeAnswer: '',
            examineeId: '',
            isRight: true,
            questionId: '',
            score: ''
          }
        ],
        examExaminers: [ // 考场-对-考官，只用填考官id
          {
            examId: '',
            examinerId: ''
          }
        ],
        excellentScore: '', // 优秀分数线
        greatScore: '', // 良好分数线
        qualifyScore: '', // 及格分数线
        id: '',
        name: '', // 考场名称
        video: 1, // 考场要求
        paperId: '', // 试卷
        place: '', // 考场地点
        positionId: '', // 岗位
        professionId: '', // 专业
        rankId: '', // 级别
        startDatetime: '', // 开始时间
        statusId: 1 // 考核状态标识,未开始1，考核中2，考核结束3
      }
    }
  },
  mounted() {
    this.getInfo()
    this.getKaosheng()
    this.getAll()
    this.getKaoguan()
    this.getShijuan()
  },
  methods: {
    add() {
      this.dialogFormVisible = true
      this.getData()
    },
    getInfo() {
      $http.get('/admin/exam/get/' + this.$route.query.id).then(response => {
        if (response.success) {
          for (let i in this.form) {
            this.form[i] = response.data[i]
          }
          this.paperId = this.form.paperId
          if (response.data.rankId) {
            this.tiaojians.push(response.data.rankId)
            if (response.data.departmentId) {
              this.tiaojians.push(response.data.departmentId)
              if (response.data.positionId) {
                this.tiaojians.push(response.data.positionId)
                if (response.data.professionId) {
                  this.tiaojians.push(response.data.professionId)
                }
              }
            }
          }
          // this.form.greatScore = response.data.greatScore*1
        } else  {
          this.$message({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    getKaosheng() {
      $http.get('/admin/exam/view/examinee/' + this.$route.query.id).then(response => {
        if (response.success) {
          let table = []
          response.data.forEach(item=> {
            table.push(item.examineeListVo.id)
          })
          this.examExaminees = table
          this.tableData_kaosheng = response.data
        } else  {
          this.$message({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    panduan(item) {
      if (this.examExaminees.includes(item.id)) {
        return false
      } else {
        return true
      }
    },
    shanchu(item, index) {
      this.$confirm('此操作将移除该考生, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        $http.post('/admin/exam/remove/examinee', {
          examId: this.$route.query.id,
          examinee: item.id
        }).then(response => {
          if (response.success) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
          } else  {
            this.$message({
              message: response.msg,
              type: 'error',
              duration: 2000
            })
          }
        }).catch(error => {
          console.log(error)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        }) 
      })
    },
    xuanze(item, pd, index) {
      if (pd&&!this.examExaminees.includes(item.id)) {
        let query = {
          examId: this.$route.query.id * 1,
          paperId : this.paperId,
          examinee: item.id
        }
        $httpFORM.post('/admin/exam/add/examinee', this.qs.stringify(query)).then(response => {
          if (response.success) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
            this.examExaminees.push(item.id)
            this.tableData_kaosheng.push({
              examineeListVo: item
            })
          } else  {
            this.$message({
              message: response.msg,
              type: 'error',
              duration: 2000
            })
          }
        }).catch(error => {
          console.log(error)
        })
      }
      if (!pd&&this.examExaminees.indexOf(item.id)>-1) {
        // this.examExaminees.splice(this.examExaminees.indexOf(item.id), 1)
        let query = {
          examId: this.$route.query.id * 1,
          examinee: item.id
        }
        $httpFORM.post('/admin/exam/remove/examinee', this.qs.stringify(query)).then(response => {
          if (response.success) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
            this.examExaminees.splice(this.examExaminees.indexOf(item.id), 1)
            this.tableData_kaosheng.splice(this.getIndex(item.id), 1)
          } else  {
            this.$message({
              message: response.msg,
              type: 'error',
              duration: 2000
            })
          }
        }).catch(error => {
          console.log(error)
        })
      }
    },
    getIndex(id) {
      for (let i = 0; i < this.tableData_kaosheng.length; i++) {
        if (id == this.tableData_kaosheng[i].examineeListVo.id) {
          return i
        }
      }
      return -1
    },
    yanzheng() {
      if(!this.form.name && this.form.name + '' !== '0') {
        this.$message.success('请输入考场')
        return false
      }
      if(!this.form.paperId && this.form.paperId + '' !== '0') {
        this.$message.success('请选择试卷')
        return false
      }
      if(!this.form.excellentScore && this.form.excellentScore + '' !== '0') {
        this.$message.success('请输入优秀分数线')
        return false
      }
      if(!this.form.greatScore && this.form.greatScore + '' !== '0') {
        this.$message.success('请输入良好分数线')
        return false
      }
      if(!this.form.qualifyScore && this.form.qualifyScore + '' !== '0') {
        this.$message.success('请输入及格分数线')
        return false
      }

      if(!this.form.computerStartDatetime && this.form.computerStartDatetime + '' !== '0') {
        this.$message.success('请选择上机开始时间')
        return false
      }
      if(!this.form.computerEndDatetime && this.form.computerEndDatetime + '' !== '0') {
        this.$message.success('请选择上机结束时间')
        return false
      }
      if(!this.form.computerPlace && this.form.computerPlace + '' !== '0') {
        this.$message.success('请输入上机地点')
        return false
      }
      
      if(!this.form.startDatetime && this.form.startDatetime + '' !== '0') {
        this.$message.success('请选择上机开始时间')
        return false
      }
      if(!this.form.endDatetime && this.form.endDatetime + '' !== '0') {
        this.$message.success('请选择上机结束时间')
        return false
      }
      if(!this.form.place && this.form.place + '' !== '0') {
        this.$message.success('请输入上机地点')
        return false
      }
      
      if (this.examExaminers.length == 0) {
        this.$message.success('请选择至少一位考官')
        return false
      }
      // if (this.examExaminees.length == 0) {
      //   this.$message.success('请选择至少一位考生')
      //   return false
      // }

      return true
    },
    submit() {
      if(!this.yanzheng()) {
        return
      }
      console.log(this.form)
      this.$confirm('此操作将修改考核, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.form.rankId = this.tiaojians.length > 0?this.tiaojians[0]:''
        this.form.departmentId = this.tiaojians.length > 1?this.tiaojians[1]:''
        this.form.positionId = this.tiaojians.length > 2?this.tiaojians[2]:''
        this.form.professionId = this.tiaojians.length > 3?this.tiaojians[3]:''

        this.form.examExaminers = []
        this.form.examExaminees = []
        this.examExaminers.forEach(item=> {
          this.form.examExaminers.push({
            examinerId: item
          })
        })
        // this.examExaminees.forEach(item=> {
        //   this.form.examExaminees.push({
        //     examineeId: item
        //   })
        // })
        $httpJSON.post('/admin/exam/amend', this.form).then(response => {
          if (response.success) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
            this.paperId = this.form.paperId
          } else  {
            this.$message({
              message: response.msg,
              type: 'error',
              duration: 2000
            })
          }
        }).catch(error => {
          console.log(error)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        }) 
      })
    },
    next() {
      this.active=2
    },
    exit() {
        this.form = {}
        this.$router.push('/examPlan')
    },
    getAll() {
      $http.get('/examinee/grade/get/all').then(response => {
        if (response.success) {
          this.type_all = response.data
        } else  {
          this.$message({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    getShijuan() {
      this.form.paperId = ''
      this.tiaojian.rankId = this.tiaojians.length > 0?this.tiaojians[0]:''
      this.tiaojian.departmentId = this.tiaojians.length > 1?this.tiaojians[1]:''
      this.tiaojian.positionId = this.tiaojians.length > 2?this.tiaojians[2]:''
      this.tiaojian.professionId = this.tiaojians.length > 3?this.tiaojians[3]:''
      $http.get('/paper/query/list', {params: this.tiaojian}).then(response => {
        if (response.success) {
          let table = []
          response.data.list.forEach(item =>{
            table.push({
              name: item.name + '-满分' + item.score + '分',
              id: item.id
            })
          })
          this.type_shijuan  = table
        } else  {
          this.$message.error({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
        
      }).catch(error => {
        console.log(error)
      })
    },
    getData() {
      this.tiaojian_kaosheng.rankId = this.tiaojians_kaosheng.length > 0?this.tiaojians_kaosheng[0]:''
      this.tiaojian_kaosheng.departmentId = this.tiaojians_kaosheng.length > 1?this.tiaojians_kaosheng[1]:''
      this.tiaojian_kaosheng.positionId = this.tiaojians_kaosheng.length > 2?this.tiaojians_kaosheng[2]:''
      this.tiaojian_kaosheng.professionId = this.tiaojians_kaosheng.length > 3?this.tiaojians_kaosheng[3]:''
      $http.get('/examinee/query/list', {params: this.tiaojian_kaosheng}).then(response => {
        if (response.success) {
          this.tableData  = response.data.list
          this.total  = response.data.total
        } else  {
          this.$message.error({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
        
      }).catch(error => {
        console.log(error)
      })
    },
    getKaoguan() {
      let query = {
        page: 1,
        size: 99999
      }
      $http.get('/amin/examiner/getlist', {params: query}).then(response => {
        if (response.success) {
          let table = []
          response.data.list.forEach(item =>{
            table.push({
              name: item.name + '-' + item.account,
              id: item.id
            })
          })
          this.type_guanli  = table
          // 查询当前考场的考官列表
          $http.get('/admin/exam/get/examiner', {params: {
            examId: this.$route.query.id
          }}).then(response => {
            if (response.success) {
              let table = []
              response.data.forEach(item =>{
                // table.push({
                //   name: item.examiner.name + '-' + item.examiner.account,
                //   id: item.examiner.id
                // })
                table.push(item.examiner.id)
              })
              this.examExaminers  = table
              console.log(this.examExaminers)
            } else  {
              this.$message.error({
                message: response.msg,
                type: 'error',
                duration: 2000
              })
            }
            
          }).catch(error => {
            console.log(error)
          })
        } else  {
          this.$message.error({
            message: response.msg,
            type: 'error',
            duration: 2000
          })
        }
        
      }).catch(error => {
        console.log(error)
      })
    },
    getJibie() {},
    getZhuanye() {},
    getLeibie() {},
    getGangwei() {},
    tingyong () {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          }) 
        })
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.tiaojian_kaosheng.size = val
      this.getData()
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.tiaojian_kaosheng.page = val
      this.getData()
    },
    tableSelect(val) {
        console.log(val)
        this.selects = val
    }
  }
}
</script>

<style lang="scss" scoped>
.buzhou{
    width:100%;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.form{
  width:100%;
  margin-top: 20px;
}
.title{
    width: 100%;
    height: 40px;
    color: rgba(102, 102, 102, 100);
    font-size: 14px;
    display: flex;
    justify-content:center;
    align-items: center;
}
.add-guanli{
    width:100%;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid rgba(24, 144, 255, 1);
    color: rgba(24, 144, 255, 100);
    font-size: 14px;
}
.head{
  margin: 20px 0 20px 0;
  width:100%;
  height: 32px;
  // display: flex;
  // align-items: center;
}
.bianhao{
    margin-top: -5px;
    margin-right: 6px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid rgba(24, 144, 255, 1);
    color:rgba(24, 144, 255, 1);
    display: flex;
    justify-content:center;
    align-items: center;

}
.top{
  width:100%;
  // height: 40px;
  padding-bottom: 20px;
  background-color: white;
}
.top-left{
  line-height:30px;
  font-size: 20px;
  color: #333333;
}
.top-right{
  width: 272px;
  line-height:30px;
}
.body{
  margin:15px 0 30px 20px;
  padding: 20px 32px 24px 32px;
  width: calc(100% - 48px);
  // height: calc(100vh - 0px);
  background-color: white;
}
.bottom{
    margin-top: 10px;
    width:100%;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>
